<template>
  <PageWrapper class="ztable" contentFullHeight>
    <vxe-grid ref='xGrid' v-bind="gridOptions">
      <template #tbtns>
        <vxe-input v-model="formData.name" placeholder="输入名称查询"></vxe-input>
        <vxe-button @click="searchEvent" status="primary">查 询</vxe-button>
        <vxe-button @click="addEvent({},openDrawer)">新 增</vxe-button>
        <vxe-button @click="deleteEvent($refs.xGrid)">删 除</vxe-button>
        <vxe-button @click="test()">同时使用JPA与mybatis-plus的事务测试</vxe-button>
      </template>
      <template #name_default="{ row }">
          <span style="cursor:pointer;color: #3e9ece"
                @click="editEvent({id:row.id},openDrawer)">{{ row.name }}</span>
      </template>
    </vxe-grid>
    <CustMainDrawer @register="registerDrawer" @success="handleSuccess"/>
  </PageWrapper>
</template>
<script lang="ts">
export default {name: 'SdCustMain', inheritAttrs: false}
</script>
<script lang="ts" setup>
import {PageWrapper} from '/@/components/Page';
import {reactive, ref} from 'vue'
import {VxeGridInstance, VxeGridProps} from 'vxe-table'
import CustMainDrawer from './CustMainDrawer.vue';
import {useDrawer} from '/@/components/Drawer';
import {deleteEvent, addEvent, editEvent, createOption} from '/@/comps/vxe/list';
import { defHttp } from "/@/utils/http/axios";
import {VXETable} from 'vxe-table'

const xGrid = ref({} as VxeGridInstance)
const formData = reactive({name: ''})

const gridOptions = reactive<VxeGridProps>(createOption('/sd/cust/main', {}, formData, [
  {type: 'checkbox', align: 'center', width: 42, fixed: 'left'},
  {type: 'seq', align: 'center', width: 50, fixed: 'left'},
  {field: 'name', title: '客户名称', width: 300, fixed: 'left', slots: {default: 'name_default'}},
  {field: 'crtim', title: '创建时间', width: 160},
  {field: 'notes', title: '备注'}
]));

const searchEvent = () => {
  xGrid.value.commitProxy('query')
}

const test=async ()=>{
  alert("检查后台事务是否回滚");
  await defHttp.post({url: '/sd/cust/main/test'});
  // alert("检查后台事务是否回滚");
  // VXETable.modal.message({ content: `检查后台事务是否回滚`, status: 'success' })
}


//--------------------------------------------------------------------------------------------------
const [registerDrawer, {openDrawer}] = useDrawer();

function handleSuccess() {
  searchEvent();
}
</script>

